<template>
  <el-form v-loading="loading">
    <el-card class="box-card" shadow="never" style="margin-bottom: 16px">

      <el-row :gutter="20">
        <el-col>
          <table-page :dataList="tableData" border :total="total" :page.sync="queryParams.pageNum"
                      :limit.sync="queryParams.pageSize">
            <template slot="tableColAc">
              <el-table-column align="center" label="操作" width="60">
                <template #default="{row}">
                  <el-button type="text" @click="handleView(row)">查看</el-button>
                </template>
              </el-table-column>
            </template>

            <template slot="tableCol">
              <el-table-column prop="customerName" min-width="120" align="center" label="还车状态">
                <template slot-scope="{row}">
                  {{ selectDictLabel(dict.type.order_return_status, row.returnStatus) }}
                </template>
              </el-table-column>
              <el-table-column prop="orderNumber" min-width="200" align="center" label="订单号">
              </el-table-column>
              <el-table-column prop="carNo" min-width="120" align="center" label="车牌号">
              </el-table-column>
              <el-table-column prop="customerName" min-width="120" align="center" label="客户名称">
              </el-table-column>
              <el-table-column prop="outboundMileage" min-width="100" align="center" label="出库里程">
              </el-table-column>
              <el-table-column prop="outboundFuel" min-width="100" align="center" label="出库油量">
              </el-table-column>
              <el-table-column prop="returnTime" min-width="100" align="center" label="还车时间">
              </el-table-column>
              <el-table-column prop="returnMileage" min-width="100" align="center" label="还车里程">
              </el-table-column>
              <el-table-column prop="drivingMileage" min-width="100" align="center" label="行驶里程">
              </el-table-column>
              <el-table-column prop="returnFuel" min-width="100" align="center" label="还车油量">
              </el-table-column>
              <el-table-column prop="violation" min-width="100" align="center" label="是否违章">
                <template slot-scope="{row}">
                  {{ selectDictLabel(dict.type.business_yes_no, row.violation) }}工单
                </template>
              </el-table-column>
              <el-table-column prop="penalty" min-width="100" align="center" label="违约金">
              </el-table-column>
              <el-table-column prop="exemptionAmount" min-width="100" align="center" label="减免金额 ">
              </el-table-column>
              <el-table-column prop="pendingDeduction" min-width="100" align="center" label="待扣金额">
              </el-table-column>
              <el-table-column prop="waitingTimeForCarReturn" min-width="120" align="center" label="待还车时间 ">
              </el-table-column>
              <el-table-column prop="createBy" min-width="120" align="center" label="申请人">
              </el-table-column>
            </template>

          </table-page>
        </el-col>
      </el-row>


    </el-card>
  </el-form>
</template>

<script>
import {getReturnStorageMessage} from "@/api/zcwh/vehicleTabs.js";

export default {
  name: 'index',
  dicts: ['order_return_status', 'business_yes_no'],
  props: ['carId'],
  computed: {
    selectDictLabel() {
      return function (arr, type) {
        let name = "";
        arr.map((v) => {
          if (type == v.value) {
            name = v.label;
          }
        });
        return name;
      }
    }
  },
  watch: {},
  data() {
    return {
      detailForm: {},
      tableData: [{name: ''}],
      loading: false,
      status: '',
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        carId: this.carId
      },
      total: 0
    };
  },
  created() {
    this.handleData()
  },
  mounted() {
  },
  methods: {
    async handleData() {
      this.loading = true
      try {
        const res = await getReturnStorageMessage(this.queryParams)
        this.tableData = res.rows
        this.total = res.total
      } catch (e) {
        console.error(e)
      } finally {
        this.loading = false
      }

    },

    handleView() {

    }
  },
};
</script>

<style scoped lang=""></style>


